<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <%- include ../taglibs/layout_head.ejs%>
    <%- include ../taglibs/layout.css.ejs%>
    <link href="js/plugins/zTree/css/metroStyle/metroStyle.css" rel="stylesheet">
</head>
<body>
<%-include("../taglibs/header.ejs",{params:{className:"active",dataIsActive:"true"}})%>
<div class="nav-body" id="divContent">
    <div class="nav-box">
        <div class="row">
            <div class="col-sm-4 col-md-3 col-lg-2 nav-box-left-box">
                <%-include("dataManageLeftMenu.ejs",{params:{className:"active",userManage:"true"}})%>
            </div>
            <div class="col-sm-6 col-md-9 col-lg-10 right-container-box">
                <div class="right-container">
                    <div class="row">
                        <div class="col-sm-12">
                            <a class="back-view" id="back-view">
                                <i class="fa fa-chevron-left fa-back-left"></i>
                                返回
                            </a>
                        </div>
                    </div>
                    <section class="content content-table">
                        <div style="display: block">
                            <ol class="head-breadcrumb">
                                <li>
                                    <a>用户管理</a>
                                </li>
                                <li class="active">
                                    <%=titleTxt%>
                                </li>
                            </ol>
                            <div class="form-content">
                                <form class="form-horizontal form-validBox" id="userInfoForm">
                                    <input type="text"  id="id" name="id" hidden="hidden">
                                    <input type="text"  id="parentId" name="parentId" hidden="hidden">
                                    <div class="form-group">
                                        <label for="parentName" class="col-sm-2 col-sm-offset-3 control-label label-require">所属上级：</label>
                                        <div class="col-sm-4">
                                            <input type="text" class="form-control" id="parentName" name="parentName" style="padding-right: 54px">
                                            <button type="button" class="btn btn-theme selectUser"
                                                    style="position: absolute;top: 0px;right: 15px;">选择</button>
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label for="name" class="col-sm-2 col-sm-offset-3 control-label label-require">用户名称：</label>
                                        <div class="col-sm-4">
                                            <input type="text" class="form-control" id="name" name="name">
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label for="deptManager" class="col-sm-2 col-sm-offset-3 control-label">联系人：</label>
                                        <div class="col-sm-4">
                                            <input type="text" class="form-control" id="deptManager" name="deptManager">
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label for="linkName" class="col-sm-2 col-sm-offset-3 control-label">联系电话：</label>
                                        <div class="col-sm-4">
                                            <input type="text" class="form-control" id="phone" name="phone">
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label for="linkName" class="col-sm-2 col-sm-offset-3 control-label"></label>
                                        <div class="col-sm-4" >
                                            <button type="button" id="submitForm" class="btn btn-round btn-theme" style="width: 100%">保 存</button>
                                        </div>
                                    </div>
                                </form>
                            </div>
                        </div>
                    </section>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="modal fade" id="myTreeDialog">
    <div class="modal-dialog" style="width: 320px;">
        <div class="modal-content" style="width: 320px;">
            <div class="modal-header">
                <button type="button" class="close" onclick="closeTreeDialog()">×</button>
                <h4 class="modal-title" id="NoPermissionModalLabel">所属上级</h4>
            </div>
            <div class="modal-body" style="height:320px;max-height:320px;max-width: 320px;
                overflow: auto;">
                <ul id="userCommonTree" class="ztree">
                </ul>
            </div>
            <div class="modal-footer">
                <button class="btn btn-info"   type="button" onclick="getAllCheckNodes()">确 定</button>
            </div>
        </div>
    </div>
</div>
<%-include ../taglibs/layout.js.ejs%>
<script src="/js/plugins/zTree/js/jquery.ztree.all-3.5.js"></script>
<script src="/js/plugins/zTree/js/jquery.ztree.exhide-3.5.js"></script>
<!--<script src="/js/ztree/ztree-cus-table.js"></script>-->
<script src="/js/ztree/ztree-cus-check.js"></script>
<script src="/js/ztree/ztree-user.js"></script>
<script type="text/javascript" src="js/viewpage/dataManage/dataManage.js"></script>
<script type="text/javascript" src="js/viewpage/dataManage/userInfo/userInfo.js"></script>
<script type="text/javascript">
    var url = '/tree/dept';
    var _id='<%=id%>';
    $(function () {
        UserInfo.initEditUserPage();
        UserTreeComponents.initUserTree('id', 'parentId', 'name',clickTree,treeCheck, "radio");
        UserTreeComponents.loadUserTree(url,"userCommonTree");
        $(".selectUser").on("click",function () {
            $("#myTreeDialog").modal("show");
        });
        if(_id){
            queryUserInfo();
        }
    })
    function clickTree(event, treeId, treeNode) {
//        debugger;
//        var flag=treeNode.checked;
//        tree_Obj.checkNode(treeNode, true, true);
//        selectTreeNode(treeNode);
    }
    function treeCheck(event, treeId, treeNode, clickFlag) {

    }
    function closeTreeDialog() {
        $("#myTreeDialog").modal("hide");
    }
    function getAllCheckNodes() {
        var node = userTreeObj.getCheckedNodes(true)[0];
        if(node){
            $("#parentName").val(node.name);
            $("#parentId").val(node.id);
        }else{
            $("#parentName").val("");
            $("#parentId").val("");
        }
        closeTreeDialog();
    }
    
    function queryUserInfo() {
        $.ajax({
            url:"/editUserInfo/queryUserInfo",
            type:"POST",
            data:{id:_id},
            dataType:"json"
        }).done(function (result) {
            if(result.isSuccess === true){
                var data = result.data;
                for(var k in data){
                    $("#userInfoForm").find("[name='"+k+"']").val(data[k]);
                }
            }
        })
    }
</script>
</body>
</html>